Atomic Design
https://gyazo.com/4c6a3bb0e3163f0b1d8bb19764766072
原典：Atomic Design | Brad Frost（2013年6月10日）
珍しいワークフロー：Atomic Designの原則とSketchでデザインからプログラミングまで | POSTD（2015年10月8日）
色や文字がAtomだとすると
色と文字とボタンのボックスの組み合わさったボタン←なぜAtomなのか。Moleculesでは？
答え：atomsとmoleculesの分類法
Atomic Designの考え方と利点・欠点 – wkr.（2016/07/19）
Q. 何がatomで何が…？
A. http://atomicdesign.bradfrost.com/chapter-2/#atomic-design-is-for-user-interfaces
Atomic Designを実案件に導入して運用してみた結果はどうなのか – wkr.
実際に使った際の問題点が述べられている
人によってコンポーネントの粒度が違う
テストがめんどくなる
コンポーネントのpropsに何があるか洗い出すのがめんどう
テストを書くときにVirtual DOMを探索するので凝集度が下がる
Atomic Design を分かったつもりになる | DeNA DESIGN BLOG（2016.9.13）
デザイナーが(はじめて？)使ってみてどう感じたか
「Atomic Design」と「Design Systems」〜デザイナーとエンジニアが二人三脚で開発する手法〜 - DMM inside（2018/05/07）
Atomic Design powered by React @ AbemaTV
LayerdAtomicDesign
Atoms
atomsとmoleculesの分類法#5c95ed4c3f4425000001eda8
https://gyazo.com/200299de4fcfe755d0db7de6c692c2d8
https://www.slideshare.net/ygoto3q/atomic-desigin-powered-by-react-abematv/31
Molecules
https://gyazo.com/7525eb60d3744a30a5c11691d3d46622
https://www.slideshare.net/ygoto3q/atomic-desigin-powered-by-react-abematv/31
Organisms
いろんな記事を読む限り、Moleculesとの区分けが悩みポイントらしい
LayerdAtomcDesignではドメインの有無で切り分けている
LayerdAtomicDesign#5c95fbdf3f442500003f5882
Templates
https://gyazo.com/2a9a05441c4275960351201359b12113
http://bradfrost.com/blog/post/atomic-web-design/
pagesはtemplatesのインスタンス
#WebのUI